<template>
  <BaseLayout title="我的待办" @query="init" @reset="reset">
    <template #query>
      <el-form :inline="true" :model="queryForm">
        <el-form-item label="待办名称">
          <el-input clearable v-model="queryForm.name" placeholder="请输入待办名称"/>
        </el-form-item>
      </el-form>
    </template>
    <template #table>
      <el-table v-loading="loading" :data="data" height="100%" class="w-full">
        <el-table-column type="index" label="序号" width="60"></el-table-column>
        <el-table-column prop="name" label="流程名称" align="left" header-align="left"></el-table-column>
        <el-table-column prop="taskName" label="节点名称" align="left" header-align="left"></el-table-column>
        <el-table-column prop="createTime" label="创建时间" align="center" header-align="center"
                         width="180"></el-table-column>
        <el-table-column label="操作" width="240" align="center" header-align="center">
          <template #default="scope">
            <el-button link type="primary" @click="dispose(scope.$index, scope.row)">处理</el-button>
          </template>
        </el-table-column>
      </el-table>
      <DisposePanel ref="disposePanelRef"></DisposePanel>
    </template>
    <template #page>
      <BasePage @load="init" v-model:current="queryForm.current" v-model:size="queryForm.size"
                :total="queryForm.total"></BasePage>
    </template>
  </BaseLayout>
</template>

<script setup lang="ts">
import DisposePanel from '/@/views/flow/component/DisposePanel.vue'

import {getNextTaskNode, listTodoTaskPageByCurrentUser} from "/@/api/flow/BaseFlowApi";
import {reactive, ref} from "vue";
import {FlowTaskModel, FlowTaskQueryModel} from "/@/api/flow/model/FlowBaseModel";
const disposePanelRef = ref();
const queryForm = reactive<FlowTaskQueryModel>({
  name: '',
  size: 10,
  current: 1,
  total: 0
})
const data = ref<any>([])
const loading = ref(false)
const init = async () => {
  loading.value = true
  let res = await listTodoTaskPageByCurrentUser(queryForm);
  data.value = res.records
  queryForm.total = res.total
  loading.value = false
}
/**
 * 重置
 */
const reset = () => {
  queryForm.name = ''
  queryForm.current = 1
  init()
}
const dispose =  (index,row) => {
  disposePanelRef.value.init(row)
}

</script>

<style scoped>

</style>